<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script src="../lib/jquery/jquery-1.12.4.min.js"></script>
<script src="./url.js"></script>
<style>
    p {
        width: 200px;
        height: 30px;
        line-height: 30px;
        border-radius: 5px;
        text-align: center;
        background: #1BA292;
        color: white;
        margin-bottom: 30px;
    }

    input {
        margin-bottom: 25px;
    }

    button{
        border: 0;
        background: #71B604;
        color: white;
        width: 80px;
        height: 30px;
        text-align: center;
        line-height: 30px;
        border-radius: 5px;
    }
</style>

<body>
    <p>顾客预约信息录入</p>
    顾客姓名： <input type="text" name="customer_name" class="name"><br>
    会员卡号： <input type="text" name="member_id" class="member_id"><br>
    员工： <input type="text" name="employee_id" class="employee"><br>
    预约时间： <input type="date" name="appointment_time" class="date"><br>
    <button>添加</button>
</body>
<script>
    $("button").click((e)=>{
        e.preventDefault()
        $.ajax({
            method:"post",
            url:`${Baseurl}/booking`,
            data:{
                customer_name:$(".name").val(),
                member_id:$(".member_id").val(),
                employee_id:$(".employee").val(),
                appointment_time:$(".date").val()
            },
            success:function(data){
                console.log(data);
            },
            error:function(err){
                console.log(err);
            }
        })
    })
</script>
</html>